import { Button, Modal, Space } from 'antd';
import { FC, ReactNode } from 'react';

interface DrawerFormProps {
  title: string; // 抽屉标题
  visible: boolean; // 抽屉是否可见
  children: Element | ReactNode;
  onClose: () => void; // 关闭时触发函数
  onConfirm: () => void; // 确认时触发函数
}

const ModalForm: FC<DrawerFormProps> = props => {
  const { title, visible, onClose, children, onConfirm } = props;

  return (
    <Modal
      destroyOnClose
      visible={visible}
      onCancel={onClose}
      maskClosable={false}
      title={title}
      onOk={onConfirm}
      //   footerStyle={{ position: 'absolute', right: 0, bottom: 0 }}
      footer={
        <Space>
          <Button onClick={onClose}>取消</Button>
          <Button type="primary" onClick={onConfirm}>
            确认
          </Button>
        </Space>
      }
    >
      {children}
    </Modal>
  );
};

export default ModalForm;
